<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    {{template "link/sell/link.html" . }}
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <style>
        .store-img {
            height: 100%;
            background-image: url("/static/upload/{{.Store.StoresMainpic}}");
            background-position: center;
        }
    </style>
</head>
<body>
<div  >
    <ul class="layui-nav">
        <li class="layui-nav-item"><a href="">店铺:{{.Store.StoresName}}</a></li>
        <li class="layui-nav-item layui-this"><a href="/sell/index">店铺主页</a></li>
        <li class="layui-nav-item"><a href="/sell/orderList">订单</a></li>
        <li class="layui-nav-item"><a href="/sell/store/manage">店铺管理</a></li>
        <li class="layui-nav-item"><a href="/sell/goodManage">商品管理</a></li>
        <li class="layui-nav-item"><a href="/sell/kindManage">种类管理</a></li>
        <li class="layui-nav-item"><a href="/sell/logout">退出</a></li>
    </ul>
</div>

<div class="content content-nav-base commodity-content">


    <div class="commod-cont-wrap">
        <div class="commod-cont w1200 layui-clear">
            <div class="store-img-box">
                <div class="store-img">
                </div>
            </div>

            <div class="show-img-box">
                <div class="layui-carousel" id="test1">
                    <div carousel-item>
                        <div class="store-main-show"><img src="/static/upload/{{.StoresLoopPic1}}"></div>
                        <div class="store-main-show"><img src="/static/upload/{{.StoresLoopPic2}}"></div>
                        <div class="store-main-show"><img src="/static/upload/{{.StoresLoopPic3}}"></div>
                    </div>
                </div>
            </div>

            <div class="left-nav">
                <div class="title">所有分类</div>
                <div class="list-box">
                    {{ range .GoodsKind}}
                        <dl>
                            <dt>{{.GoodsKindName}}</dt>
                            {{range  .Children}}
                                <dd><a href="/sell/kind/{{.GoodsKindId}}">{{.GoodsKindName}}</a></dd>
                            {{end}}
                        </dl>
                    {{end}}
                </div>
            </div>
            <div class="right-cont-wrap">
                <div class="right-cont">
                    <div class="sort layui-clear">
                        <a class="active" href="javascript:;" event='volume'>销量</a>
                        <a href="javascript:;" event="comment">评分</a>
                        <a href="javascript:;" event='price'>价格</a>
                        <span style="margin-left: 25px">最低价</span>

                        <div class="layui-input-inline">
                            <input type="text" value="" class="layui-input" style="height: 25px">
                        </div>

                        <span>最高价</span>
                        <div class="layui-input-inline">
                            <input type="text" value="" class="layui-input" style="height: 25px">
                        </div>
                        <button class="layui-btn layui-btn-normal" style="height: 25px; line-height: 15px;">查询</button>
                    </div>
                    <div class="prod-number">
                        <span>{{.Goods | len }}</span>
                    </div>
                    <div class="cont-list layui-clear" id="list-cont">
                        {{range .Goods}}
                            <div class="item">
                                <div class="img">
                                    <a href="/sell/good?id={{.GoodId}}"><img class="good-img"
                                                                                       src="/static/upload/good/{{ .GoodUrl }}"></a>
                                </div>
                                <div class="text">
                                    <p class="price">
                                        <span class="pri" style="font-size: 20px">￥ {{.GoodPrices}}</span>
                                        <span class="nub">销量:{{.GoodCount}}</span>
                                    </p>
                                    <p class="title" style="position: relative;top: 11px;font-size: 13px">{{.GoodName}}</p>
                                </div>
                                <div class="text">
                                    <p><a style="color: #888" href="javascript:">店铺:{{.GoodStoreName   }}</a></p>
                                </div>
                            </div>
                        {{end}}
                    </div>
                    <div id="demo0" style="text-align: center;"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>

    layui.config({
        base: '/static/js/util/' //你存放新模块的目录，注意，不是layui的模块目录
    }).use(['mm', 'laypage', 'jquery', "carousel"], function () {
        var laypage = layui.laypage, $ = layui.$,
            mm = layui.mm;
        laypage.render({
            elem: 'demo0'
            , count: 100 //数据总数
        });


        // 模版引擎导入
        //  var html = demo.innerHTML;
        //  var listCont = document.getElementById('list-cont');
        //  // console.log(layui.router("#/about.html"))
        // mm.request({
        //     url: '../json/commodity.json',
        //     success : function(res){
        //       console.log(res)
        //       listCont.innerHTML = mm.renderHtml(html,res)
        //     },
        //     error: function(res){
        //       console.log(res);
        //     }
        //   })

        $('.sort a').on('click', function () {
            $(this).addClass('active').siblings().removeClass('active');
        })
        $('.list-box dt').on('click', function () {
            if ($(this).attr('off')) {
                $(this).removeClass('active').siblings('dd').show()
                $(this).attr('off', '')
            } else {
                $(this).addClass('active').siblings('dd').hide()
                $(this).attr('off', true)
            }
        })
        var carousel = layui.carousel;
        //建造实例
        carousel.render({
            elem: '#test1'
            , width: '100%' //设置容器宽度
            , arrow: 'hover' //始终显示箭头
            , height: '380px'
            //,anim: 'updown' //切换动画方式
        });
    });
</script>


</body>
</html>